From 15f52f55955d56989b7b6039c04c0df427ff1bde Mon Sep 17 00:00:00 2001
From: Fuwn <contact@fuwn.me>
Date: Thu, 18 Apr 2024 18:38:14 -0700
Subject: feat(badges): badge preview pane

---
 src/routes/user/[user]/badges/+page.svelte | 12 ++++++++++++
 1 file changed, 12 insertions(+)

(limited to 'src/routes/user/[user]/badges/+page.svelte')

diff --git a/src/routes/user/[user]/badges/+page.svelte b/src/routes/user/[user]/badges/+page.svelte
index ccce0be1..f45ee1e7 100644
--- a/src/routes/user/[user]/badges/+page.svelte
+++ b/src/routes/user/[user]/badges/+page.svelte
@@ -25,6 +25,7 @@
 	import { browser } from '$app/environment';
 	// import { io } from 'socket.io-client';
 	import Tooltip from '$lib/Tooltip/LinkedTooltip.svelte';
+	import BadgePreview from '$lib/BadgeWall/BadgePreview.svelte';
 
 	export let data;
 
@@ -809,6 +810,7 @@
 											{:else}
 												<FallbackBadge
 													{badge}
+													bind:selectedBadge
 													source={cdn(thumbnail(badge.image))}
 													alternative={badge.description}
 													fallback={thumbnail(badge.image)}
@@ -826,6 +828,16 @@
 							{/each}
 						{/if}
 					</div>
+
+					<Popup
+						fullscreen
+						show={selectedBadge !== undefined && selectedBadge.image !== undefined && !editMode}
+						onLeave={() => {
+							selectedBadge = undefined;
+						}}
+					>
+						<BadgePreview badge={selectedBadge} />
+					</Popup>
 				{:catch}
 					<Popup fullscreen locked>Could not parse badges</Popup>
 				{/await}
-- 
cgit v1.2.3

